<template>
	<view class="">
		<u-navbar :is-back="true" title="我的课表" back-icon-color="#ffffff" :background="{backgroundColor:'#E62131'}"
			title-color="#ffffff"></u-navbar>
		<view class="heightlsit">
			<view class="tiotietlwes border_color ">
				<span style="display: flex;align-items: center;padding-left: 25%;" >
					<span style="padding-right: 5rpx;"><wly-datetime-picker type="date" :isIcons="false"
							inputStyle="background-color:#ffffff;width:300rpx" v-model="parms.searchTime"
							@change="maskClick" ></wly-datetime-picker></span>
				</span>
			</view>
		</view>
		<view class="listcenter">
			<view class="toplist  border_color" v-for="(item,index) in tablist" :key="index" @click="topagesList(item)">
				<view class="topcen fliexs space_between">
					<view class="titlesleft">
						{{item.courseName ||''}}
						<!-- <span class="weishnagke">末上课</span> -->
					</view>
					<u-icon @click="modalactive(index)" name="arrow-right" color="#a7a7a7"
						size="30"></u-icon>
				</view>
				<view class="" style="font-size: 30rpx;font-weight: bold;padding: 20rpx 0;">
					{{item.classDate}}	{{item.classStartTime}}~{{item.classEndTime}}
				</view>
				<view class="centerlist">
					<u-icon name="account-fill" color="#a7a7a7" size="30"></u-icon> <span
						style="padding-left: 10rpx;">{{item.coachName}}</span>
				</view>
				
				<view class="btnlist fliexs space_between">
					<view class="fliexs">
						<u-icon name="order" color="#a7a7a7" size="30"></u-icon>
						<span style="padding-left: 10rpx;" >
							{{item.campusName}}
							</span>
						
					</view>
					<!-- <view>总({{item.allnum}}) 出({{item.onedance}}) 缺({{item.totwodance}})</view> -->
				</view>
				<!-- <view class="listListad" v-if="actives == index">
					<view class="uls">
						<view class="lis" @click.stop="topagesList('./addreport?id=' + item.id+'&searchTime='+parms.searchTime)">
							写课堂报告
						</view>
						<view class="lis" @click.stop="topagesList('./endclass?item=' + JSON.stringify(item))">
							修改排课
						</view>
						<view class="lis" style="border: none;" @click.stop="removepalke(item)">
							删除排课
						</view>
					</view>
				</view> -->
			</view>
		</view>



		<u-popup v-model="show" mode="bottom" z-index="99" :safe-area-inset-bottom="true"  border-radius="14" :closeable="true">
			<view class="centers">
				<view class="centertitl">
					课程详情
				</view>
				<view class="listmodal">
					<text class="leftname">上课校区</text> <text>世茂广场校区</text>
				</view>
				<view class="listmodal">
					<text class="leftname">课程名称</text> <text>世茂广场校区</text>
				</view>
				<view class="listmodal">
					<text class="leftname">上课时间</text> <text>20235-58-5</text>
				</view>
				<view class="listmodal">
					<text class="leftname">教练</text> <text>兰伟铭</text>
				</view>
				<view class="listmodal">
					<text class="leftname">年级科目</text> <text>兴趣班</text>
				</view>
				<view class="listmodal">
					<text class="leftname">年级科目</text> <text>兴趣班</text>
				</view>
			</view>
		</u-popup>

		<u-picker mode="time" v-model="showdate" :params="dateparams" @confirm="confirmdate" confirm-color="#E62131"></u-picker>
		<u-modal v-model="outshow" :content="content" @confirm="confirm" @cancel="cancel"
			:show-cancel-button="true"></u-modal>
	</view>
</template>

<script>
	export default {

		data() {
			return {
				slictshow: false,
				single: '',
				show: false,
				username: "",
				password: "",
				actives: null,
				users: null,
				current: 0,
				form: {
					courseName: '',
					coachName: '',
					className: '',
					studentName: '',
					isAttendance: '',
					texts:"",
				},
				parms: {
					limit: 10,
					page: 1,
					searchTime: "",
				},
				minaparms: {
					limit: 10,
					page: 1,
					searchTime: "",
					studentName: '',
					isAttendance: '',
				},
				tablist: [],
				toals: 0,
				ismoads: 0,
				items: null,
				classHours:0,
			}
		},
		onLoad(options) {
			var timestamp = uni.$func.now();
			this.parms.searchTime = uni.$func.datetime(timestamp, 1)
			this.minaparms.searchTime = uni.$func.datetime(timestamp, 7)
			// this.heightList()
		},
		onShareAppMessage(res) {
			return {
				title: '',
				path: "/pages/index/index"
			}
		},
		onShow() {
			this.parms.page = 1
			this.tablist = [];
			this.classHours = 0
			this.workoutListAPI()

		},
		onReachBottom() {
			console.log(1111)
			this.parms.page += 1
			this.workoutListAPI()
		},
		methods: {
			clichs(){
				this.form = {
					courseName: '',
					coachName: '',
					className: '',
					studentName: '',
					isAttendance: '',
					texts:"",
				};
			},
			oklistTlist(){
				this.tablist = [];
				this.classHours = 0
				this.parms.courseName = this.form.courseName
				this.parms.coachName = this.form.coachName
				this.parms.className = this.form.className
				this.workoutListAPI()
				this.show = false
			},
			heightList() {
				uni.createSelectorQuery().select('.heightlsit').boundingClientRect(function(res) {
					this.heights = res.height
				}).exec()
			},
			maskClick(e) {
				this.parms.page = 1
				this.tablist = [];
				this.classHours = 0
				this.parms.searchTime = e
				this.workoutListAPI()
			},
			workoutListAPI() {
				uni.$api.common.studentworkList(this.parms).then((res) => {
					res.result.forEach((item) => {
						// this.classHours += item.classHours
						// item.allnum = item.studentWorkList.length;
						// item.onedance = 0;
						// item.totwodance = 0;
						// item.studentWorkList.forEach((elmes) => {
						// 	if (elmes.isAttendance == 1) {
						// 		item.onedance += 1
						// 	}
						// 	if (elmes.isAttendance == 2) {
						// 		item.totwodance += 1
						// 	}
						// 	// if (elmes.isAttendance == 0) {
						// 	// 	item.totwodance += 1
						// 	// }
						// })
						if (res.count === this.tablist.length &&  this.tablist.length>0) {
							uni.showToast({
								title: '没有更多了',
								icon: 'none',
								duration: 2000
							});
						} else {
							res.result.forEach((item) => {
								this.tablist.push(item)
							})
						}
					})
					this.toals = res.count;
					// this.tablist = res.result
					this.clichs()
				});
			},
			studentworkListApi() {
				uni.$api.common.studentworkList(this.minaparms).then((res) => {
					res.result.forEach((item) => {
						this.classHours += item.workOut.classHours
						this.tablist.push(item)
					})
					this.toals = res.count;
					// this.tablist = res.result
					this.clichs()
				});
			},
			clcikmoave() {
				// this.actives = null
			},
			modalactive(index) {
				if (this.actives == index) {
					this.actives = null
				} else {
					this.actives = index
				}

			},
			adlasdflj() {
				// this.actives = null
			},
			isshowmodal() {
				this.show = true;
			},
			outLogin() {
				uni.clearStorage();
				uni.redirectTo({
					url: "./index"
				})
			},
			getUserInfoApi() {
				uni.$api.common.getUserInfo().then((res) => {
					this.users = res.result
				});
			},
			topagesList(item,url,index) {
				uni.navigateTo({
					url:"./myCurriculumDetail?id="+item.id
				})
				// if(!url && index == 1){
				// 	this.show = true
				// }else{
				// 	uni.navigateTo({
				// 		url
				// 	})
				// 	this.actives = null
				// }
				
			},
			topaesad() {
				uni.navigateTo({
					url: "./indexlist"
				})
			},
			outmumny(item) {
				this.items = item
				this.outshow = true;
				this.ismoads = 1
				this.content = "是否确定扣费？"
			},
			confirm() {
				if (this.ismoads == 2) {
					uni.$api.common.deleteoutkList(this.items.id).then((res) => {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
						this.actives = false
						this.workoutListAPI()
					});
				}
				if (this.ismoads == 1) {
					let obj = {
						id: this.items.workId,
						studentWorkIds: [{
							id: this.items.id,
							isAttendance: 1,
						}]
					}
					uni.$api.common.editHours(obj).then((res) => {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
						this.minaparms.page = 1
						this.tablist = [];
						this.classHours = 0
						this.studentworkListApi()
					});
				}
			},
			removepalke(item) {
				this.items = item
				this.outshow = true;
				this.ismoads = 2
				this.content = "是否确定删除该排课？"
			},
		}
	}
</script>

<style lang="scss">
	.tiotietlwes {
		text-align: center;
		color: #b1b1b1;
		// padding: 20rpx 0;
		position: relative;
	}

	.imgicons {
		position: absolute;
		right: 20rpx;
		bottom: 0;
		top: 0;
		display: flex;
		align-items: center;
	}

	.border_color {
		border-bottom: 1rpx solid #e1e1e1;
	}

	.lsitcentes {
		padding: 20rpx;

		.lefttxt {
			color: #b1b1b1;
		}

		.righttext {
			color: #a7a7a7;
		}
	}

	.listcenter {
		padding: 20px;

		.toplist {
			position: relative;
			padding: 20rpx 0;

			.topcen {
				.titlesleft {
					.canghs {
						display: inline-block;
						padding: 2rpx 6rpx;
						border-radius: 4rpx;
						background-color: #E62131;
						color: #ffffff;
						font-size: 24rpx;
						margin-right: 10px;
					}

					.weishnagke {
						margin-left: 10rpx;
						display: inline-block;
						padding: 5rpx 12rpx;
						border-radius: 10rpx;
						border: 1rpx solid #E62131;
						color: #E62131;
						font-size: 20rpx;
					}
				}
			}

			.centerlist {
				margin: 0rpx 0 10rpx;
				color: #b1b1b1;
			}

			.btnlist {
				color: #b1b1b1;
			}

			.listListad {
				position: absolute;
				right: 100rpx;
				top: 20rpx;
				z-index: 9;
				text-align: center;
				background-color: #ffffff;
				border-radius: 5rpx;

				.uls {
					padding: 0 10rpx;

					.lis {
						padding: 30rpx 30rpx;
						border-bottom: 1rpx solid #e1e1e1;
					}
				}
			}
		}
	}

	

	.centers {
		width: 100%;
		padding: 0 30rpx;
		.centertitl{
			width: 100%;
			text-align: left;
			padding: 30rpx 0;
			font-weight: bold;
			font-size: 30rpx;
		}
		.listmodal{
			padding: 30rpx 0;
			border-top: 1rpx solid #e1e1e1;
			color: #b1b1b1;
			.leftname{
				display: inline-block;
				width: 150rpx;
			}
		}
	}


</style>